<script setup>
import {ref} from "vue";
import {DelStrategy, getStrategy} from "@/api/strategy";
import {ElMessage, ElMessageBox} from "element-plus";

const dialogVisible = ref(false)

// 打开
const open = () => {
 dialogVisible.value = true
 getList()
}

// 关闭
const handleClose = () => {
 dialogVisible.value = false
}

const list = ref([])

// 获取策略列表
const getList = () => {
 Promise.try(() => {
  return getStrategy()
 }).then(res => {
  list.value = res.data
 })
}

// 修改名称
const modifyStrategy = (name, id) => {

}

// 使用策略
const toUseStrategy = (name, id) => {

}

// 删除策略
const loading = ref(false)
const deleteStrategy = (name, id) => {
 ElMessageBox.confirm(`是否删除策略名为${name}`, '提示', {
  confirmButtonText: '确认',
  cancelButtonText: '取消'
 }).then(() => {
  loading.value = true
  Promise.try(() => {
   return DelStrategy({strategy_id: id})
  }).then(res => {
   getList()
   ElMessage.success('删除成功')
  })
  loading.value = false
 })
}

// 暴露给父级的方法
defineExpose({
 open
})
</script>

<template>
 <el-dialog
  v-model="dialogVisible"
  v-loading="loading"
  title="策略池"
  width="700"
  :before-close="handleClose"
  :close-on-press-escape="false"
  :close-on-click-modal="false"
 >
  <el-table :data="list" >
   <el-table-column prop="name" label="组合策略" />
   <el-table-column prop="symbol" label="产品" />
   <el-table-column label="操作" align="center" width="250">
    <template #default="{row}">
<!--     <el-button @click="modifyStrategy(row.name, row.id)" size="small" type="primary">修改名称</el-button>-->
<!--     <el-button @click="toUseStrategy(row.name, row.id)" size="small" type="primary">使用</el-button>-->
     <el-button type="danger" size="small" @click="deleteStrategy(row.name, row.id)">删除</el-button>
    </template>
   </el-table-column>
  </el-table>
 </el-dialog>
</template>

<style scoped lang="scss">

</style>